<!-- 反馈列表 -->
<template>
	<div class="systemFeedback" v-loading="systemFeedbackLoading">
		<div class="title">反馈列表</div>
    <div class="tableBox">
      <el-table :data="feedbackList.rows" border size="mini"
        style="width: 100%" :header-cell-style="{color: '#444444',}"
      > 
        <el-table-column
          prop="title"
          label="主题"
          align="center">
        </el-table-column>
        <el-table-column
          prop="person"
          label="提交人"
          align="center">
        </el-table-column>
        <el-table-column
          prop="phone"
          label="联系电话"
          align="center">
        </el-table-column>
        <el-table-column
          prop="content"
          label="反馈信息"
          align="center">
        </el-table-column>
      </el-table>
    </div>
    <myPaging :func="pageUpdate" :total="feedbackList.total"></myPaging>
	</div>
</template>
<script>
import {mapActions, mapGetters} from 'vuex'
import myPaging from '@/components/myPaging.vue'
export default {
  name: 'systemFeedback',
  data() {
    return {
      msg: 'hello systemFeedback!',
      systemFeedbackLoading: false,
		}
  },
	methods: {
    ...mapActions([
      'fetchFeedbackList',
    ]),
    async onSubmit(pageOption = {pageSize: this.pageSize, pageNum: 1}) {
      this.systemFeedbackLoading = true

      await this.fetchFeedbackList({ ...pageOption })

      this.systemFeedbackLoading = false
    },
    pageUpdate(option) {
      this.onSubmit(option)
    },

  },
  computed: {
    ...mapGetters({
      feedbackList: 'getFeedbackList',
      
      //分页依赖
      pageSize: 'getPageSize',
    })
  },
  components: {
    myPaging
  },
  created() {
    this.onSubmit()
  },

}
</script>
<style scoped>
.systemFeedback {
  background: #fff;
  min-height: 100%;
  padding: 0 20px 0 20px;
}
.systemFeedback .title {
  position: relative;
  left: 15px;
  line-height: 70px;
  font-size: 16px;
}
.systemFeedback .title::before {
  content: '';
  position: absolute;
  left: -15px;
  width: 4px;
  height: 20px;
  top: 25px;
  background-color: #2399ff;
}
.searchBox {
  background: #fff;
  margin-bottom: 15px;
}
.experience .line {
  text-align: center;
}
.experience {
  margin-top: 20px;
  
}
.experience .subTit {
  font-size: 18px;
  color: #444;
  line-height: 44px;
  margin-bottom: 15px;
}
.headimg {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  overflow: hidden;
  vertical-align: middle;
  box-shadow: 1px 1px 5px #757575;
  margin: 4px 0;
}
</style>
